<template>
	 <div class="activiesBar canpaginBar" v-if="activitiesBar">
        <div style="width:14%;height: 100%;color:#ABABAB;line-height:1.4rem;">
            促销
        </div> 
        <div style="width:86%;">
            <RegularList v-for="(item,index) in activitiesBar.RegularList" :key="index" :regularList="item"></RegularList>
            <FixedList v-for="(item,index) in activitiesBar.fixedPackageList" :key="index" :FixedList="item"></FixedList>
            <Promotions v-for="(item,index) in activitiesBar.promotionalList" :key="index" :promotions="item"></Promotions>
        </div>
        <div style="width:5%;height: 100%;color:#ABABAB;line-height:1.4rem;">
        	<i style="font-size: 0.7rem;color: #ccc;" class="icon njfont nj-youjiantou"></i>
        </div>
        <!-- <Coupons v-for="(item,index) in activitiesBar.couponList" :key="index" :coupons="item"></Coupons>   -->
    </div>
</template>
<script>
    import RegularList from './RegularList';
    import FixedList from './FixedList';
    import Coupons from './Coupons';
    import Promotions from './Promotions';
	export default {
		props: {
            activitiesBar: {
                type: Object,
                default: {}
            },
        },
        components:{
            RegularList,
            FixedList,
            Coupons,
            Promotions
        },
		data () {
			return {

			}
		},
		computed: {

		},
		methods: {

        },
        created () {

        },
        mounted () {
        },
        beforeDestroy() {

        },
        watch: {
            activitiesBar(newVal){
                console.log("msg comming")
            }
        }

	}
</script>

<style scoped>
    .canpaginBar{
        padding-bottom: 0.5rem;
        border-bottom: 1px solid #eaeaee;
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
    }
</style>


